<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  hello, world
  <a href="#" id="size-12">12</a>
  <a href="#" id="size-14">14</a>
  <a href="#" id="size-16">16</a>
  <script>
    // const size = fontSize => {
    //   const inner = () => {
    //     document.body.style.fontSize = fontSize + 'px'
    //   }
    //   return inner
    // }
    const size = fontSize => () => document.body.style.fontSize = fontSize + 'px'
    document.querySelector('#size-12').onclick = size(12)
    document.querySelector('#size-14').onclick = size(14)
    document.querySelector('#size-16').onclick = size(16)


    // const makadder = y => {
    //   const add = x => x + y
    //   return add
    // }
    const makadder = y => x => x + y

    const add5 = makadder(5)
    console.log(add5(2))

    const add20 = makadder(20)
    console.log(add20(10))
  </script>
</body>

</html>